import React from 'react'
import jsonData from '../../axios/Info.json'

export default function Info() {
    const InfoList = jsonData.data
    return (
        <div className='Info'>
            {/* <div aria-live="polite" aria-atomic="true" style={flag ? { position: "relative", minHeight: 50 + "px" } : { position: "relative", minHeight: 50 + "px", display: "none" }}>
                <div className={flag ? "toast fade show" : "toast"} style={{ position: "absolute", top: "0", right: "0" }}>
                    <div className="toast-header">
                        <img src="..." className="rounded mr-2" alt="..."/>
                        <strong className="mr-auto">经验</strong>
                        <small>+3</small>
                        <button type="button" className="ml-2 mb-1 close" data-dismiss="toast" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                    </div>
                    <div className="toast-body">Hello, world!</div>
                </div>
            </div> */}
            <table className="table table-bordered p-3 mb-2 bg-white text-dark" style={{maxHeight: 480 + "px"}}>
                <thead>
                <tr>
                    {/* <th scope="col"></th> */}
                    <th scope="col">
                        <button type="button" className='btn btn-primary' onClick={() => alert("经验 + 5")}>发帖
                        </button>
                    </th>
                    <th scope="col">
                        <button type="button" className='btn btn-primary' onClick={() => alert("经验 + 3")}>签到
                        </button>
                    </th>
                </tr>
                </thead>
                {InfoList.map((item, index) => {
                    return <tbody>
                    <tr>
                        {/* <th scope="row">{index + 1}</th> */}
                        <td>{item.title}</td>
                        <td>{item.content}</td>
                    </tr>
                    </tbody>
                })}
            </table>
        </div>

    )
}
